<% @title = t('.title') %>

<div class="t-body l-overflow">
  <div class="l-half--l l-half--l--center">
    <%= @qrcode_svg %>
  </div>
  <div>
    <p><%= t('.scan_prompt') %></p>
    <p>
      <span><%= t('.account', account: "#{issuer}:#{current_user.email}") %></span><br>
      <span id="otp-key"><%= t('.key', key: @seed.chars.each_slice(4).map(&:join).join(' ')) %></span><br>
      <span><%= t('.time_based') %></span>
    </p>
  </div>
</div>

<%= form_tag totp_path, method: :post do %>
  <div class="text_field">
    <%= label_tag :otp, 'OTP code', class: 'form__label' %>
    <p class='form__field__instructions'><%= t '.otp_prompt' %></p>
    <%= text_field_tag :otp, '', class: 'form__input', autocomplete: 'one-time-code' %>
  </div>
  <%= submit_tag t('.enable'), class: 'form__submit' %>
<% end %>
